<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<link rel="stylesheet" href="../../assets/css/layui.css">
	<link rel="stylesheet" href="../../assets/css/view.css"/>
	<title></title>
</head>
<body class="layui-view-body">
	<div class="layui-content">
		<div class="layui-row">
			<div class="layui-card">
				<div class="layui-card-header">添加新用户</div>
				<form id="form" class="layui-form layui-card-body" ><!--id为from-->
					<div class="layui-form-item">
						<label class="layui-form-label">姓名</label>
						<div class="layui-input-block">
							<input type="text" name="userName" required  lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">手机号码</label>
						<div class="layui-input-block">
								<input type="text" name="userPhone" onblur="testUserPhone()" required  lay-verify="required" placeholder="请输入手机号码" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">身份证号码</label>
						<div class="layui-input-block">
							<input type="text" name="idCardNumber" required  lay-verify="required" onblur="testUserIDCardNo()" placeholder="请输入身份证号码" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">密码</label>
						<div class="layui-input-block">
							<input type="text" name="passWord" required  lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-input-block">
							<button class="layui-btn layui-btn-blue" lay-submit lay-filter="formDemo">立即提交</button>
							<button type="reset" class="layui-btn layui-btn-primary">重置</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<script src="../../assets/layui.all.js"></script>
	<script src="/qrcode/jquery2.1.4.js"></script>
	<script src="/layer/layer.js"></script>
	<script>
		var form = layui.form
		 	,layer = layui.layer;
	</script>
	<script>
		var flagPhone = false;
		var flagIdCard = false;
		function testUserPhone(){
			var insertUserPhone = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/;
			var phone = $.trim($('input:eq(1)').val());
			if (insertUserPhone.test(phone)) {
				flagPhone = true;
			}else {
				layer.msg("请输入有效的手机号!");
				return false;
			}
		}

		function testUserIDCardNo(){
			var insertIdCard = /(^[1|2|3|4|5|6|7|8|9]\d{17}$)/;
			var idCard = $.trim($('input:eq(2)').val());
			if (insertIdCard.test(idCard)) {
				flagIdCard = true;
			}else {
				layer.msg("请输入有效的身份证号码!");
				return false;
			}
		}

		$(function(){
			$("#form").submit(function(){
				if(flagPhone && flagIdCard) {
					//转圈
					var windowId = layer.load();
					//获取四个输入款内容
					var username = $("input:eq(0)").val();//eq(0)表示第0个输入框
					var userPhone = $("input:eq(1)").val();
					var userIdCardNo = $("input:eq(2)").val();
					var password = $("input:eq(3)").val();
					$.post("/user/insert.do", {//传递数据给服务器的参数 键值对
						username: username,
						userPhone: userPhone,
						userIdCardNo: userIdCardNo,
						password: password
					}, function (data) {
						layer.close(windowId);//先关闭load窗口
						layer.msg(data.result);//弹窗显示  补一补layer里面的这写功能
						if (data.status == 0) {
							//录入成功
							$("input").val("");
						} else {
							//录入失败
						}
					});
					return false;
				}else if(flagIdCard){
					layer.msg("请输入有效的手机号!");
					return false;
				}else {
					layer.msg("请输入有效的身份证号码!");
					return false;
				}
			});
		});
	</script>
</body>
</html>
